<template>
  <div>
    <el-tree
      :data='data'
      show-checkbox
      node-key='id'
      check-strictly
      efault-expand-all
      :default-checked-keys="defKeys"
      :props='defaultProps'>
    </el-tree>
  </div>
</template>

<script>
export default {
  data () {
    return {
      data: [{
        id: 1,
        lible: '管理员',
        children: [{
          id: 2,
          lible: '管理员列表',
          children: [{ id: 27, lible: '管理员列表' }, { id: 28, lible: '修改用户状态' }, {
            id: 29,
            lible: '管理员详情'
          }, { id: 30, lible: '管理员添加' }, { id: 31, lible: '管理员修改' }, {
            id: 32,
            lible: '管理员删除'
          }, { id: 33, lible: '获取角色列表' }, { id: 34, lible: '保存角色' }]
        }]
      }, {
        id: 3,
        lible: '权限',
        children: [{
          id: 4,
          lible: '角色设置',
          children: [{ id: 22, lible: '角色列表' }, { id: 23, lible: '添加角色' }, {
            id: 24,
            lible: '更新角色'
          }, { id: 25, lible: '删除角色' }, { id: 26, lible: '修改权限' }]
        }, { id: 5, lible: '权限查看', children: [{ id: 7, lible: '权限列表API' }, { id: 21, lible: '权限列表2' }] }]
      }, {
        id: 8,
        lible: '文章管理',
        children: [{
          id: 9,
          lible: '测试一下咋地',
          children: [{ id: 19, lible: '测试而已模拟' }, { id: 20, lible: '测试2' }]
        }]
      }],
      defaultProps: {
        children: 'children',
        label: 'lible'
      },
      defKeys: [1]
    }
  }
}
</script>

<style scoped>

</style>
